<template>
  <div>
    <el-dialog width="60%" :visible.sync="formShow" @close="handleClickDeal('cancel')" v-dialog-drag :modal-append-to-body="false" :close-on-click-modal="false">
      <span slot="title">
        <i class="iconfont icon-jinduguanli1"></i>
        <span>{{ title }}</span>
      </span>

      <el-tabs v-model="activeName" style="width:100%;">
        <el-tab-pane label="基本信息" name="first">
          <cmsDetailRowFile :tableFileList="formBaseData.file" :showTable="showRowTable"></cmsDetailRowFile>
          <div class="WholeScroll" style="max-height: 650px; overflow: auto">
            <el-form :model="formBaseData" ref="formBaseData" :rules="formBaseRules" class="measurepaycompensation_detail_form">
              <el-row>
                <el-col :span="12">
                  <el-form-item label="标段" prop="sectionId" :label-width="formlabelWidth">
                    <el-select class="select" value-key="id" v-model="formBaseData.sectionId" placeholder="选择标段" style="width: 100%" disabled>
                      <el-option v-for="item in sectionTree" :key="item.id" :label="item.name" :value="item.id">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <el-form-item class="" label="计划年度" prop="year" :label-width="formlabelWidth">
                    <el-date-picker class="contract-ele" style="width:100%;" v-model="formBaseData.year" @change="getIntVersion" type="year" value-format="yyyy" :disabled="(detailType === 'check' || detailType === 'approve' || tabShow)">
                    </el-date-picker>
                  </el-form-item>
                </el-col>

              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="计划版本号" prop="versionNumber" :label-width="formlabelWidth">
                    <el-input class="contract-ele" v-model="formBaseData.versionNumber" placeholder disabled>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item class="" label="版本制定日期" prop="orderDate" :label-width="formlabelWidth">
                    <el-date-picker class="contract-ele" style="width:100%;" v-model="formBaseData.orderDate" type="date" value-format="yyyy-MM-dd" :picker-options="pickerOptions" :disabled="(detailType === 'check' || detailType === 'approve' || tabShow)">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="24">
                  <el-form-item label="备注" prop="remarks" :label-width="formlabelWidth">
                    <el-input style="width: 100%" class="contract-ele-long" v-model="formBaseData.remarks" placeholder rows="8" type="textarea" :disabled="(detailType === 'check' || detailType === 'approve' || tabShow)"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>

              <!--              <el-row>
                <el-col :span="19" style="position: relative">
                  <el-col :span="22">
                    <el-form-item
                      label="附件"
                      prop="proimg"
                      :label-width="formlabelWidth"
                    >
                      <cmsUploadFile
                        ref="fileOne"
                        :fileList="fileListArr"
                        :detail-id="detailId"
                        :fileSystem="fileSystem['one']"
                        disabled
                        type="mul"
                        info="支持上传 png/jpg/gif/doc/xlsx/ppt/pdf 文件"
                        :detail-type="detailType" />
                    </el-form-item>
                  </el-col>
                </el-col>
              </el-row>-->

              <el-row>
                <el-col :span="12">
                  <el-form-item prop="referenceOtherData" label="上一版本制定日期" :label-width="formlabelWidth">
                    <el-input v-model="formBaseData.referenceOtherData" disabled></el-input>

                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label=" " :label-width="formlabelWidth">
                    <el-button v-if="detailType !== 'check' && detailType !== 'approve'" :loading="isLoading2" type="primary" size="small" @click="prepareData">
                      开始做计划
                    </el-button>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-table v-show="tabShow" class="allplan-manage-detail-table" ref="allplanTable" :data="formBaseData.treeVOS" :header-cell-style="discountHeaderStyle" :row-class-name="tableRowClassName" :cell-class-name="tableCellClassName" style="margin-bottom: 20px;" width="1600" height="510" row-key="imageBreakIdTreePK" border :tree-props="{children: 'children', hasChildren: 'hasChildren'}" @cell-click="cellClick">
                <el-table-column prop="engineerName" label="工程名称">
                </el-table-column>
                <el-table-column prop="unit" label="单位">
                </el-table-column>
                <el-table-column prop="number" label="数量">
                </el-table-column>
                <el-table-column prop="unitprice" label="综合单价（元）">
                </el-table-column>

                <el-table-column prop="numberPlan" label="计划完成量">
                  <template slot-scope="{ row, column }">
                    <el-input v-if="row.index == rowIndex && column.index == columnIndex" v-model="row.numberPlan" @blur="inputBlur('count',row)" type="number" :disabled="(detailType === 'check' || detailType === 'approve')"></el-input>
                    <span v-else>{{ row.numberPlan }}</span>
                  </template>
                </el-table-column>

                <el-table-column prop="comprehensiveOutputWyPlan" label="计划完成产值（万元）">
                  <template slot-scope="{ row, column }">
                    <el-input v-if="row.index == rowIndex && column.index == columnIndex" v-model="row.comprehensiveOutputWyPlan" @blur="inputBlur" type="number" :disabled="(detailType === 'check' || detailType === 'approve')"></el-input>
                    <span v-else>{{ row.comprehensiveOutputWyPlan }}</span>
                  </template>
                </el-table-column>

                <!-- <el-table-column prop="constructPileNumStruct" label="施工桩号及结构">
                  <template slot-scope="{ row, column }">
                    <el-input v-if="row.index == rowIndex && column.index == columnIndex" v-model="row.constructPileNumStruct" :disabled="(detailType === 'check' || detailType === 'approve')"></el-input>
                    <span v-else>{{row.constructPileNumStruct }}</span>
                  </template>
                </el-table-column> -->
              </el-table>

            </el-form>
          </div>
        </el-tab-pane>
      </el-tabs>

      <div slot="footer" class="dialog-footer">
        <template v-if="detailType === 'build' || detailType === 'edit'">
          <el-button size="small" type="primary" :loading="isLoading" @click="handleClickDeal('submit', { flag: 1 })"><i class="iconfont icon-icon_save"></i> 确 定
          </el-button>
        </template>
        <el-button size="small" @click="handleClickDeal('cancel')"><i class="iconfont icon-icon_cancel"></i> 取 消
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import msgUtil from '@/utils/msgUtil'
import projectSectionInfo from '@/api/buss/common'
import scheduleanual from '@/api/buss/scheduleanual'

import WfProcess from "@/components/WorkFlow/process";
import BpmnForm from "@/components/ExtBpmn/ExtForm/bpmn-form";
import PopBtn from "@/components/ExtBpmn/Btn";
import startMixin from "@/mixins/wfStartMixin";
import approveMixin from "@/mixins/wfApproveMixin";

export default {
  name: 'aggregate-planning-detail',
  components: {
    WfProcess,
    BpmnForm,
    PopBtn
  },
  mixins: [startMixin, approveMixin],

  props: {
    postDetail: {
      type: Object,
      default: {
        show: false,
        type: 'build',
        params: {}
      }
    }
  },
  data() {
    return {

      // 流程参数 str ####################################
      isShowBpmn: false,
      isMultiple: false,
      variables: {},
      entity: {},
      fileList: [],
      wfNode: {},
      showBpmnForm: false,
      setManage: '',//项目公司选项:1项目办，2指挥部
      attributeUrl: 'buss/progressscheduleanual/node/attribute',
      urlProcess: 'buss/progressscheduleanual/process',
      readonly: false,
      // 流程参数 end ####################################

      // 附件参数
      fileListArr: [],

      fileSystem: {
        'one': {
          attachId: '',
          sys: 'buss',
          module: 'progressscheduleanual',
          part: 'file1',
          entityClass: 'progressscheduleanual',
          viewByAnon: true,
          longLife: false,
          compoName: 'fileOne'
        }
      }, // 文件系统的参数


      rowIndex: -1, //行索引
      columnIndex: -1, //列索引
      actionType: '查看',
      title: '',

      sectionTree: [], // 标段下拉
      referenceOtherDataList: [],
      canEdit: true,


      //存放图片的数组
      fileListArray: [],
      detailType: 'build', // 详情类型 build新建 check不可编辑查看 edit编辑
      detailId: '', // 当前详情的id
      activeName: 'first', //

      tabShow: false,
      detailActions: [], // 当前详情的操作项
      formShow: false, // 表单展示
      radioValue: '',//单选按钮选中的值
      formlabelWidth: '140px', // 表单左侧标题宽度
      // 表单基本信息内容
      addSectionId: '',
      // canEditPlan:true, // 开始做计划时 不允许修改form 表单
      formBaseData: {
        sectionId: '',
        versionNumber: '',
        year: '',
        remarks: '',
        referenceOtherData: '',
        orderDate: new Date().Format("yyyy-MM-dd"),
        treeVOS: [],
      },
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
      },
      // 表单基本信息验证
      formBaseRules: {
        sectionId: [
          {
            required: true,
            message: '请选择标段',
            trigger: 'change'
          }
        ],
        versionNumber: [
          {
            required: true,
            message: '请输入总体计划版本号',
            trigger: 'change'
          }
        ],
        year: [
          {
            required: true,
            message: '请选择计划年度',
            trigger: 'change'
          }
        ],
        orderDate: [
          {
            required: true,
            message: '请选择版本制定日期',
            trigger: 'change'
          }
        ],

        referenceOtherData: [
          {
            required: false,
            message: '请选择引用其他版本数据',
            trigger: 'change'
          }
        ], approver: [
          {
            required: true,
            message: '请选择审批人',
            trigger: 'change'
          }
        ], approveMessage: [
          {
            required: true,
            message: '请填写审批意见',
            trigger: 'change'
          }
        ],
      },
      treeVOS: [],
      tableColumn: [],
      tabsYear: null,
      //  现在编辑的单元格标记

      showAudit: false,
      isLoading: false,
      isLoading2: false,

      //  显示导入错误日志
      showErrorLog: false,
      errorLog: [],

    }
  },
  watch: {
    postDetail(value) {
      console.log("type=", value.type)
      // 显示详情弹窗
      this.formShow = value.show
      // 初始化窗口参数
      this.activeName = 'first'
      // 详情类型
      this.detailType = value.type
      this.actionType = value.typeName
      this.showAudit = true
      if (this.detailType == 'build') {
        this.isShowBpmn = true
        this.title = '新增'
      } else if (this.detailType == 'check') {
        this.title = '查看项目详情'
      } else if (this.detailType == 'edit') {
        this.isShowBpmn = true
        this.title = '编辑'
      } else if (this.detailType == 'approve') {
        this.isShowBpmn = true
        this.title = '审核'
      } else {
        this.title = ''
      }
      // 详情id
      if (this.detailType == 'build') {
        this.detailId = ''
        this.addSectionId = value.addSectionId
        this.initData();
      } else {
        this.detailId = value.detailId || value.params.detailId
      }
      // 非新建详情时 获取详情
      // console.log((this.detailType === 'check' || this.detailType === 'approve' || this.tabShow));
      if (this.detailType == 'build') {
        this.tabShow = false;
      } else {
        this.getAllSecTree();
        // 获取详情请求
        this.getDetail();
      }
    }
  },
  methods: {

    showRowTable() {
      if (this.detailType == 'check' || this.detailType == 'approve') {
        return true
      } else {
        return false
      }
    },


    /**  流程方法str **/
    onApprove(params, callback) {
      const dealForm = this.$refs.bpmnForm.getForm();
      if (!params || params.isReject != 1) {
        if (this.$refs.bpmnForm.showUserSelect) {
          if (!dealForm.selectAssigneeList.length) {
            callback && callback();
            msgUtil.error2('请选择处理人!')
            return
          }
        }
      }
      this.approveForm.procDefKey = 'progressScheduleYearProcess'
      this.approveForm.businessId = this.formBaseData.id
      this.approveForm.procInstId = this.formBaseData.procInstId
      this.approveForm.description = dealForm.description
      this.approveForm.selectAssigneeList = dealForm.selectAssigneeList
      this.approveForm.entity = this.formBaseData
      // 覆盖按钮参数
      Object.assign(this.approveForm, params)
      scheduleanual.audit(this.approveForm).then(res => {
        msgUtil.success2('审批成功!')
        this.formShow = false
        this.$emit('reloadList')
      }).finally(() => {
        callback && callback();
      })
    },

    // 上报
    onApply(_, callback) {
      // 表单验证
      this.$refs['formBaseData'].validate((valid) => {
        if (valid) {
          let startForm = {}
          startForm.entity = this.formBaseData
          startForm.procDefKey = 'progressScheduleYearProcess'
          startForm.businessId = this.formBaseData.id
          startForm.variables = this.variables
          const dealForm = this.$refs.bpmnForm.getForm()
          startForm.selectAssigneeList = dealForm.selectAssigneeList
          if (!dealForm.selectAssigneeList.length) {
            callback && callback();
            msgUtil.error2('请选择处理人!')
            return
          }
          scheduleanual.report(startForm).then(async (res) => {
            if (res.code == 200) {
              this.detailId = res.data.businessId
              // await this.saveFiles()
              this.formShow = false
              this.$notify({
                title: '上报成功',
                type: 'success',
                duration: 1500
              })
              this.$refs.btn.resetLoading()
              await this.$emit('reloadList');

            }
          }).finally(() => {
            this.$refs.btn.resetLoading()
            callback && callback();
          })
        } else {
          this.$refs.btn.resetLoading()
        }
      })
    },


    // 保存文件
    saveFiles() {
      for (let k in this.fileSystem) {
        let fileProp = this.fileSystem[k]
        this.$refs[fileProp.compoName].saveAll(this.detailId)
      }
    },

    loadFiles() {
      // this.$nextTick(()=>{
      //   for (let k in this.fileSystem) {
      //     let fileProp = this.fileSystem[k]
      //     this.$refs[fileProp.compoName].init()
      //   }
      // })
    },


    fetchData() {
      this.$emit('reload')
    },

    cancel() {
      this.handleClickDeal('cancel')
    },

    onSave(_, callback) {
      this.handleClickDeal('submit', { flag: 1 }, callback)
    },

    onComplete(data) {
      this.wfNode = data
    },



    /** 流程方法end  **/

    tableRowClassName({ row, rowIndex }) {
      // 把每一行的索引放到row里
      row.index = rowIndex;
    },
    tableCellClassName({ column, columnIndex }) {
      // 把每一列的索引放到column里
      column.index = columnIndex;
    },
    cellClick(row, column) {
      if (row.isLeaf == '1') {
        this.rowIndex = row.index;
        this.columnIndex = column.index;
      }
    },
    // 失去焦点
    inputBlur(type, row) {
      if (type == 'count') {
        if (row.unitprice) {
          row.comprehensiveOutputWyPlan = ((row.unitprice * row.numberPlan) / 10000).toFixed(6)
        }
      }
      this.rowIndex = -1;
      this.columnIndex = -1;

      this.calculateParentValue()
    },
    calculateParentValue() {
      let calculateParentValue = function(node) {
        let sum = 0
        node.children.forEach((i, t) => {
          if (i.isLeaf == '1') {
            sum = sum + Number(i.comprehensiveOutputWyPlan)
          } else {
            if (i.hasOwnProperty('children') && i.children.length > 0) {
              sum = sum + calculateParentValue(i)
            }
          }
        })
        node.comprehensiveOutputWyPlan = sum.toFixed(6)
        node.isCalculate = true
        return sum
      }
      let treeData = JSON.parse(JSON.stringify(this.formBaseData.treeVOS))
      treeData.forEach((item, index) => {
        calculateParentValue(item);
      })
      this.$set(this.formBaseData, 'treeVOS', treeData)
    },
    initData() {
      if (this.detailType == 'build') {
        projectSectionInfo.getAllSecTree().then(res => {
          if (res.code === 200) {
            var data = res.data;
            this.sectionTree = data
            if (this.detailType == 'build') {
              this.formBaseData.sectionId = this.addSectionId;
              this.initBtn();
              // 获取最新版本号
              this.getIntVersion();
              // 获取上一版本制定日期
              this.getBeforeVersionDate();
            }
          } else {
            msgUtil.error2(res.data.message)
          }
        })
      }
    },


    getAllSecTree() {
      projectSectionInfo.getAllSecTree().then(res => {
        if (res.code === 200) {
          var data = res.data;
          this.sectionTree = data
        } else {
          msgUtil.error2(res.data.message)
        }
      })
    },

    initBtn() {
      const params = {
        businessId: this.formBaseData.id,
        procDefKey: 'progressScheduleYearProcess',
        url: this.attributeUrl,
        entity: this.formBaseData,
        variables: this.variables,
      }
      // this.$refs.bpmnForm.initNodeAttribute(params);
      // this.$refs.btn.getBtnListWithParam(params);
    },

    // 获取版本号
    getIntVersion() {
      let sectionId = this.formBaseData.sectionId;
      let year = this.formBaseData.year
      if (sectionId && year) {
        let postData = {
          sectionId: sectionId,
          year: year
        }
        this.$httpPost(`buss/progressscheduleanual/getIntVersion`, postData).then(res => {
          if (res.code === 200) {
            this.formBaseData.versionNumber = res.data;
          } else {
            msgUtil.error2(res.data.message)
          }
        }).catch((res) => {
          console.log(res)
        }).finally((response) => {
        })
      }
    },

    // 获取上个日期
    getBeforeVersionDate() {
      let postData = {
        sectionId: this.formBaseData.sectionId
      }
      this.$httpPost(`buss/progressscheduleanual/getBeforeVersionDate`, this.formBaseData).then(res => {
        if (res.code === 200) {
          this.formBaseData.referenceOtherData = res.data
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch((res) => {
        console.log(res)
      }).finally((response) => {
      })
    },



    discountHeaderStyle({ row, column, rowIndex, columnIndex }) {
      if (rowIndex == 1) {
        return { display: 'none' }
      }
    },
    submit(flag, callback) {
      let submit = 'buss/progressscheduleanual/submit'
      let resubmit = 'buss/progressscheduleanual/resubmit'
      let url = this.detailType == 'build' ? submit : resubmit
      if (!this.formBaseData.treeVOS) {
        this.$messageError("请填写明细数据")
        return;
      }
      let param = JSON.parse(JSON.stringify(this.formBaseData));
      param.orderDate = this.formBaseData.orderDate.substring(0, 10)
      return this.$httpPost(url, param).then(res => {
        if (res.code == 200) {
          this.detailId = res.data.id
          this.$messageSuccess("保存成功")
        } else {
          this.$messageError(res.data.message);
        }
        if (callback) callback();
      }).catch(e => {
        console.log(e);
        this.$messageError("请求保存数据失败")
        if (callback) callback();
      }).finally(res => {
        if (callback) callback();
      })
    },


    prepareData() {
      if (!this.formBaseData.sectionId) {
        this.$messageWarning("标段不能为空");
        return
      }
      if (!this.formBaseData.year) {
        this.$messageWarning("计划年份不能为空");
        return
      }
      this.tabShow = true;
      if (this.formBaseData.referenceOtherData) {
        // 当上一版本在的时候 通过历史数据初始化
        this.prepareDataHis();
      } else {
        // 初始化第一版数据
        this.prepareDataCs();
      }
    },


    // 初始第一版数据
    prepareDataCs() {
      let postData = {
        sectionId: this.formBaseData.sectionId,
        year: this.formBaseData.year,

      }
      this.$httpPost(`buss/progressscheduleanual/prepareData`, postData).then(res => {
        if (res.code === 200) {
          this.formBaseData.treeVOS = res.data
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch((res) => {
        console.log(res)
      }).finally((response) => {
      })
    },

    // 最新的一期数据 进行初始化数据
    prepareDataHis() {
      let postData = {
        sectionId: this.formBaseData.sectionId,
        year: this.formBaseData.year,
      }
      this.$httpPost(`buss/progressscheduleanual/prepareDataByBeforeData`, postData).then(res => {
        if (res.code === 200) {
          this.formBaseData.treeVOS = res.data
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch((res) => {
        console.log(res)
      }).finally((response) => {
      })
    },

    // 获取详情请求 api
    getDetail() {
      this.isLoading2 = true
      this.$httpGet(
        `buss/progressscheduleanual/getOne?id=` + this.detailId,
        {}).then(res => {
          this.isLoading2 = false

          if (res.code == 200) {
            this.formBaseData = res.data
            this.formBaseData.id = res.data.id
            this.formBaseData.sectionId = res.data.sectionId
            this.formBaseData.versionNumber = res.data.versionNumber
            this.formBaseData.year = res.data.yearStr
            this.formBaseData.remarks = res.data.remarks
            this.formBaseData.referenceOtherData = res.data.referenceOtherData
            this.formBaseData.orderDate = res.data.orderDate
            this.formBaseData.treeVOS = res.data.treeVOS
            if (this.detailType == 'approve' || this.detailType == 'edit') {
              this.initBtn()
            }

            // if (this.detailType != 'edit') {
            //   this.tabShow = true
            // }
            this.tabShow = true

            this.$nextTick(() => {
              console.log("显示树")
              this.showTree = true;
            })
            this.loadFiles()
            this.$forceUpdate()
          } else {
            this.$messageError(res.data.message)
          }
        }).catch(res => {
          this.isLoading2 = false
          console.log('请求出现错误', res);
          this.$messageError(this.$route.name + '请求失败')
        })
    },

    // 事件处理的api请求
    sealDealHttp(url, query, params, callback) {
      this.$httpPost(
        this.$store.state.httpHost.buss + url + query,
        params
      ).then(res => {
        if (res.data.status === 1) {
          if (callback) callback(res.data)
        } else {
          this.$messageError(res.data.message)
        }
      }).catch(res => {
        console.log(res)
      })
    },
    // 点击各个流程的按钮事件
    handleClickDeal(type, res, callback) {
      console.log(type, res)
      switch (type) {
        // 取消，关闭窗口
        case 'cancel':
          this.showAudit = false
          this.isShowBpmn = false
          // 重置表单验证
          this.$refs['formBaseData'].resetFields()
          // 清空表单内容
          this.formBaseData = {
            sectionId: '',
            versionNumber: '',
            year: '',
            remarks: '',
            referenceOtherData: '',
            orderDate: new Date().Format("yyyy-MM-dd"),
            treeVOS: [],

          }, // 表单基本信息内容
            this.radioValue = ''
          this.sectionTree = []
          this.formShow = false
          //清空按钮 数组
          this.fileListArray = []
          break
        // 保存
        case 'submit':
          let flag = res.flag
          // 表单验证
          this.$refs['formBaseData'].validate((valid) => {
            if (valid) {
              // 提交详情
              this.submit((flag), () => {
                this.formShow = false
                // 传值给父组件刷新列表
                this.$emit('reloadList')
              }).finally(() => {
                callback && callback();
              })
            } else {
              callback && callback();
            }
          })
          break
        // 删除
        case 'delete':
          this.$prompt('删除理由', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
          }).then(({ value }) => {
            if (value === null || value === '') {
              this.$messageError('请填写删除理由后重试')
              return
            }
            this.sealDealHttp(res.url, ``, {}, {
              id: this.detailId,
              description: value,
            }, () => {
              this.$messageSuccess('删除成功!')
              onEmit.$emit('Ajax')
              this.formShow = false
              //清空按钮 数组
              this.fileListArray = []
              // 传值给父组件刷新列表
              this.$emit('reloadList')
            })
          }).catch(() => {
            console.log('请求出现错误');
          });
          break

      }
    },
    numFilter(value) {
      try {
        if (value) {
          value = Number.parseFloat(value.toString())
        } else {
          return value;
        }
        let before = value.toFixed(2)
        before = before.toString()
        let num = before.split('.')[0]
        let numSmall = before.split('.')[1]
        let result = [], counter = 0;
        num = (num || 0).toString().split('');
        for (let i = num.length - 1; i >= 0; i--) {
          counter++;
          result.unshift(num[i]);
          if (!(counter % 3) && i != 0) {
            result.unshift(',');
          }
        }
        let after = numSmall === undefined ? result.join('') : result.join('') + '.' + numSmall
        return after
      } catch (e) {
        console.log(e);
        return value
      }
    },
  },

  filters: {
    numFilter(value) {
      try {
        let before = value.toFixed(2)
        before = before.toString()
        let num = before.split('.')[0]
        let numSmall = before.split('.')[1]
        let result = [], counter = 0;
        num = (num || 0).toString().split('');
        for (let i = num.length - 1; i >= 0; i--) {
          counter++;
          result.unshift(num[i]);
          if (!(counter % 3) && i != 0) {
            result.unshift(',');
          }
        }
        let after = numSmall === undefined ? result.join('') : result.join('') + '.' + numSmall
        return after
      } catch (e) {
        return ""
      }
    },
    numFilter2(value) {
      try {
        let before = value.toFixed(2)
        return before
      } catch (e) {
        return ""
      }
    }
  },
  created() {
  },
}
</script>

<style scoped lang="scss">
.fee_add {
  color: #008fe0;
  border-color: #008fe0;
  float: right;
  margin-bottom: 10px;
}

.el-input__inner {
  width: 291px;
}

.dialogTableDiv {
  width: 100%;
  margin: 0 auto;

  .tableTitle {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;

    p {
      font-size: 16px;
    }

    .add {
      background-color: #ffffff;
      color: rgb(73, 163, 250);
    }
  }
}

.meterage-manage-detail
  .el-date-editor.el-input.el-input--prefix.el-input--suffix.el-date-editor--date {
  width: 255px;
}

/*.tree-menu {*/
/*color: black !important;*/
/*div{*/
/*color: black !important;*/
/*}*/
/*}*/
</style>
<style lang="scss">
.el-message-box {
  .el-message-box__btns {
    .el-button {
      font-size: 14px;
    }
  }
}
</style>
